@model String
@{
    var descriptor = ViewData.ModelMetadata.GetViewDescriptor();
    var fieldId = Html.Id("");
}

<div class="input-group">
    @Html.TextBox("", Model, descriptor?.ToHtmlProperties())
    <div class="input-group-addon">
        <a class="random" href="javascript:void(0)">
            <svg xmlns:svg="http://www.w3.org/2000/svg" viewBox="0 0 1200 1200" style="width: 18px;height: 18px;">
                <path d="M935.926,42.203v186.061H763.958c-54.408,0-114.484,26.559-164.729,77.32
	c-50.242,50.761-104.842,126.065-191.527,249.904c-87.076,124.394-135.567,199.565-165.807,233.346
	c-30.24,33.78-25.376,30.882-69.388,30.882H2.08H0v147.863h2.08h170.427c66.078,0,132.54-27.619,179.515-80.093
	c46.975-52.475,91.312-125.164,176.742-247.208c85.82-122.601,140.381-195.159,175.512-230.651
	c35.129-35.491,36.641-33.5,59.685-33.5h171.967v194.147L1200,306.276L935.926,42.203z M0,228.263v147.863h2.08h170.427
	c44.012,0,39.148-2.975,69.388,30.805c19.456,21.734,51.507,67.826,91.49,125.915c5.419-7.773,7.973-11.521,13.708-19.716
	c21.78-31.114,41.563-59.187,59.838-84.79c6.36-8.91,11.688-15.939,17.714-24.259c-27.021-39.039-49.525-70.001-72.623-95.803
	c-46.975-52.474-113.437-80.015-179.515-80.015H2.079H0L0,228.263z M935.926,629.727v189.988H763.958
	c-23.043,0-24.554,1.915-59.684-33.577c-23.237-23.477-56.146-65.093-99.809-124.76c-5.281,7.49-9.555,13.418-15.095,21.333
	c-30.571,43.674-51.648,75.183-73.777,107.816c31.395,41.578,58.12,73.875,83.637,99.652
	c50.242,50.763,110.319,77.397,164.729,77.397h171.968v190.22L1200,893.801L935.926,629.727z"></path>
            </svg>
        </a>
    </div>
</div>

@using (Script.AtFoot())
{
    <script type="text/javascript">
        $("#@fieldId").closest(".input-group").find(".random").click(function () {
            $("#@fieldId").val(Math.random().toString(36).substring(2));
        });
    </script>
}